<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>微分销自媒体平台</title>
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/qrcode.min.js}"></script>
</head>
<body>
<input type="hidden" id="orderId" th:value="${order.id}">
<div>
    <label>
        商品名称:
        <span th:text="${order.goodsName}"></span>
    </label>
</div>
<div>
    <label>
        收件人电话号码
        <span th:text="${order.phone}"></span>
    </label>
</div>
<div>
    <label>
        收件人姓名：
        <span th:text="${order.buyername}"></span>
    </label>
</div>
<div>
    <label>
        收件人留言：
        <span th:text="${order.remark}"></span>
    </label>
</div>
<div>
    <label>
        收件人地址：
        <span th:text="${order.province}"></span>&nbsp;<span th:text="${order.city}"></span>&nbsp;<span th:text="${order.district}"></span><br/>
        详细地址：<span th:text="${order.address}"></span>
    </label>
</div>
<div>
    <label>
        价格：<span th:text="${order.price}"></span>分
    </label>
</div>
<div id="qrcode" style="width:165px; height:165px; margin-top:15px;"></div>

<script type="text/javascript">
    var qrcode = new QRCode(document.getElementById("qrcode"), {
        width: 165,
        height: 165
    });

    $(function () {
        var orderId = $("#orderId").val();
        post("order/getQR", {"orderId": orderId}, function (result) {
            qrcode.makeCode(result.data);
        });

        var i = null;
        i = setInterval(function () {
            post("order/getPayStatus", {"orderId": orderId}, function (result) {
                if (result.data === "PAID") {
                    clearInterval(i);
                    reload(base + "order/list");
                }
            });
        }, 1000);
    });
</script>

</body>
</html>